<template>
  <div>
    <Row style="padding:20px">
      <Col span="4">
        <Card :bordered="false" shadow>
          <p slot="title">生成总量</p>
          <p>{{memberInfo.createToken}}</p>
        </Card>
      </Col>
      <Col span="4" offset="1">
        <Card shadow>
          <p slot="title">销毁总量</p>
          <p>{{memberInfo.burnToken}}</p>
        </Card>
      </Col>
      <Col span="4" offset="1">
        <Card shadow>
          <p slot="title">购买总量</p>
          <p>{{memberInfo.buyToken}}</p>
        </Card>
      </Col>
      <Col span="4" offset="1">
        <Card shadow>
          <p slot="title">碳信用分数</p>
          <p>{{memberInfo.CEL}}</p>
        </Card>
      </Col>
      <Col span="4" offset="1">
        <Card shadow>
          <p slot="title">能效等级</p>
          <p>{{memberInfo.EL}}</p>
        </Card>
      </Col>
    </Row>
    <Row style="padding:20px">
      <Col span="24" offset="3">
        <delay-echarts style="border-radius: 20px;background-color: white"/>
      </Col>
    </Row>
  </div>
</template>
<script>
import Pie from "@/views/League/components/Pie";
import DelayEcharts from "@/views/League/components/DelayEcharts";
export default {
  components:{
    Pie,
    DelayEcharts
  },
  data(){
    return{
      memberInfo:{
        createToken:0,
        burnToken:0,
        buyToken:0,
        CEL:0,
        EL:0
      }

    }
  },
  mounted() {
    this.LeagueJS.getTokenWaysInfo(info=>{
      console.log(info)
      this.memberInfo.createToken=info._createToken[info._createToken.length-1]
      this.memberInfo.burnToken=info._burnToken[info._burnToken.length-1]
      this.memberInfo.buyToken=info._buyToken[info._buyToken.length-1]
      this.memberInfo.CEL=info._CEL[info._CEL.length-1]
      this.memberInfo.EL=info._EL[info._EL.length-1]
    })
  }
}
</script>
<style lang="less">
.el-row {
  margin-bottom: 20px;
  &:last-child {
    margin-bottom: 0;
  }
}
.el-col {
  border-radius: 4px;
}
.bg-purple-dark {
  background: #99a9bf;
}
.bg-purple {
  background: #d3dce6;
}
.bg-purple-light {
  background: #e5e9f2;
}
.grid-content {
  border-radius: 4px;
  min-height: 36px;
}
.row-bg {
  padding: 10px 0;
  background-color: #f9fafc;
}
</style>
